<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<style type="text/css">
			/**
			 * 为span后，紧挨着的第一个p元素设置一个背景颜色为黄色。
			 * 加几个就跳几个
			 */
			/* span+p+p{
				background-color: yellow;
			} */
			/**
			 * 为span后，所有的p
			 * span+p~p这样也可以
			 */
			span+p~p{
				background-color: yellow;
			}
			/**
			 * 否定伪类
			 * 不是hello类的p标签
			 */
			p:not(.hello){
				background-color: blue;
			}
		</style>
	</head>
	<body>
		<span>HELLO</span>
		<p>111111111111111111</p>
		<p>111111111111111111</p>
		<p>111111111111111111</p>
		<p>111111111111111111</p>
		<!-- 这个仍然是黄色背景，因为是div的第一个子元素 -->
		<div id="">
			<p>22222222</p>
		</div>
		<p class="hello">2222222222</p>
	</body>
</html>
